//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    classList: [],
    rightList:[],
    classID:""
  },
  onLoad: function () {

    // 显示等待框
    wx.showLoading({
      title: '加载中'
    })

    // 注意this指向
    var _this = this;
  
    // 请求商品分类
    wx.request({
      url: 'http://hewu1122.com/shop/mobile/menu.php',
      data: {
       
      },
      header: {
        'content-Type': 'application/json' // 默认值
      },
      success: function (res) { 
        console.log(res.data)   
        // 给数据里每个分类添加一个状态值，用于判断样式是否激活
        var mydata = res.data.data; 
        for (var i = 0; i < mydata.length;i++){
             mydata[i].active = false;
        } 
        mydata[0].active = true; // 页面开始第一个为激活样式
        // 修改data里的数据
        _this.setData({
          classList: mydata,
          classID: mydata[0].id
        })
         //获取到商品分类里的第一个分类ID， 获取右边的数据
        _this.getRight(mydata[0].id); 
      }
    })
   
  },
  // 自定义方法，用于tab切换
  tabMenu:function(event){

    var classID = event.currentTarget.dataset.id; // 数据存储在dom节点对象
    var index = event.currentTarget.dataset.index;  // 获取当前点击的下标
    // 处理激活样式
    var classList = this.data.classList;
    // 将所有的样式激活值改为false
    for(var i=0; i<classList.length; i++){ 
      classList[i].active = false;
    }
    // 将点击的那个改为true
    classList[index].active = true;
    // 重新修改数据
    this.setData({
      classList: classList
    })
     // 获取右边的数据
    this.getRight(classID);
  },
  // 封装好右边请求数据的方法，第一次需要传入第一个分类商品的ID，以后每次tab切换从点击的dom节点上获取的内容，然后调用该方法
  getRight:function(classID){
    // 请求第一个商品的分类的数据，给右边
    var _this = this;
    wx.request({
      url: 'http://hewu1122.com/shop/mobile/list.php',
      data: {
        classID: classID
      },
      header: {
        'content-Type': 'application/json' // 默认值
      },
      success: function (res) {
        // 修改data里的数据
        _this.setData({
          rightList: res.data.data,
          classID:classID
        })
        // 关闭等待框
        wx.hideLoading()
      }
    })
  }
})
